<template>
	<view class="about-me-wrap">
		<eui-nav-bar title="关于管e通" color="#000000" backgroundColor="#ffffff" rightIcon="" />
		<view class="content" :style="{height: height + 'px'}">
			<eui-base-card class="card-box">
				<view class="flex-column-center top">
					<image src="@/static/img/logo.png" mode="scaleToFill" />
					<view class="app-name">管e通</view>
					<view class="version" style="margin-bottom: 8rpx;">服务端版本号 {{ versionNo }}</view>
					<view class="version">App版本号 {{ wgtVersion }}</view>
				</view>
				<view class="split-line"></view>
				<view v-for="(item, index) in rowList" :key="index" class="flex-row-between row-item"
					@click="handleItem(index)">
					<view class="label">{{ item }}</view>
					<view class="iconfont icon-qrcode1" v-if="index == rowList.length-1"></view>
					<view class="iconfont icon-jiantouxiangyou"></view>
				</view>
				<view class="copyright">©2012-2024昂捷信息·技术支持</view>

			</eui-base-card>
		</view>
	</view>
</template>

<script setup type="ts">
	import { onLoad, onShow } from '@dcloudio/uni-app';
	import { ref } from 'vue'
	import service from '../../../common/service';
	import { useLoginStore } from '../../../store/modules/useLoginStore';
	import { useSystemInfoStore } from '@/store/useSystemInfo';

	const LoginStore = useLoginStore();

	// system系统参数 
	const systemInfoStore = useSystemInfoStore(); // 系统参数

	const height = ref(0);
	const rowList = ref(['功能介绍', '安装二维码']);
	const versionNo = ref('');
	const wgtVersion = ref('');

	// 初始化滚动区域高度
	const initScrollView =() => {
		height.value = systemInfoStore.systemInfo.windowHeight - systemInfoStore.systemInfo.statusBarHeight - systemInfoStore.navBarHeight
	}

	const GetAppLastVesion = () => {
		service.enjoyShowLoading('正在加载...');
		let request = {
		    url: LoginStore.EnjoyMain,
		    data: {
		        UniqueKey: "管易通40公共",
		        ObjectData: "",
		        MethodName: "GetAppLastVesion",
		    },
		}
		service.request(request, (res) => {
		    if (res && res.data) {
				if (!res.data.HasException) {
					if (res.data.ObjectData && res.data.ObjectData.length > 0) {
						versionNo.value = res.data.ObjectData[0].c_version
					}
				} else {
					service.enjoyShowToast(res.data.Exception.Message)
				}
				service.enjoyHideLoading();
		    }
			service.enjoyHideLoading();
		}, () => {
			service.enjoyHideLoading();
		    console.log('失败')
		});
	}
	const getWgtVersion = () => {
		// #ifdef APP
		plus.runtime.getProperty(plus.runtime.appid, function(wgtinfo) {
			wgtVersion.value = wgtinfo.version;
			console.log('应用版本号: ' + wgtinfo.version);
			console.log('应用版本代码: ' + wgtinfo.versionCode);
			
		});
		// #endif

		// #ifndef APP
		wgtVersion.value = systemInfoStore.systemInfo.appWgtVersion || systemInfoStore.systemInfo.appVersion || '';
		// #endif
	}

	const handleItem = (index) => {
		const routerList = ['/pages/MainViews/aboutMe/introduce','/pages/MainViews/aboutMe/barCode'];
		uni.navigateTo({
		  url: routerList[index]
		});
	}

	onShow(() => {
		initScrollView()
	});
	onLoad(()=>{
		GetAppLastVesion();
		getWgtVersion();
	})
</script>

<style lang="scss" scoped>
	.about-me-wrap {
		height: 100%;
		background-color: $enjoy-bg-color;
	}

	.content {
		padding: 20rpx;
		margin-bottom: env(safe-area-inset-bottom);
		box-sizing: border-box;
		.row-item {
			padding-left: 12rpx;
			height: 100rpx;
			border-bottom: 1px solid #EEEEEE;
			box-sizing: border-box;
		}
	}

	::v-deep .card-box {
		position: relative;
		height: 100% !important;
		.copyright {
			position: absolute;
			bottom: 40rpx;
			left: 0;
			right: 0;
			margin: 0 auto;
			height: 44rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 20rpx;
			color: #888888;
			text-align: center;
		}
	}

	.top {
		margin-top: 60rpx;
		width: 100%;
		display: flex;
		justify-content: center;
		align-content: center;
		margin-bottom: 100rpx;

		image {
			width: 123rpx;
			height: 123rpx;
			margin-bottom: 20rpx;
		}

		.app-name {
			margin-bottom: 28rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 36rpx;
			color: #000000;
			line-height: 44rpx;
		}

		.version {
			width: 100%;
			height: 33rpx;
			line-height: 33rpx;
			text-align: center;
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 24rpx;
			color: #888888;
		}
	}

	.label {
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		font-size: 28rpx;
		color: #000000;
		flex: 1;
	}

	.icon-qrcode1 {
		margin-right: 10px;
		font-size: 21px;
		color: #999999;
	}
</style>